<template>
    <!--  有下划线有备注详情模型 -->
    <div class="eChartsType" >
      <div class="content">
        <div class="header">
          <p class="title">{{pageItem.title}}</p>
          <el-tooltip :content="pageItem.describes" placement="top">
            <i class="iconfont iconshuoming cursor-pointer"></i>
          </el-tooltip>
        </div>
        <div class="center">
          <div class="center-left">
            <p><span class="font_50 blueColor">1,444</span><span>元/吨</span></p>
          </div>
          <span class="icon">
            $
          </span>
        </div>
        <div class="bottom">
          {{pageItem.varString }}
          <!--<p class="statistics">-->
          <!--<span class="top_s">环比 12%</span>-->
          <!--<span class="bottom_s">同比 15.36%</span>-->
          <!--</p>-->
        </div>
      </div>

    </div>
</template>

<script>
    export default {
        name: 'eChartsType',
        props: {
          pageItem: {
            type: Object
          }
        }
    }
</script>

<style scoped lang="scss">
  .eChartsType{
    height:100%;
    width:100%;
    .center{
      display: flex;
      align-items: center;
      justify-content: space-between;
    }
  }

</style>
